<template>
	<view class="container">

		<view>
			<u--form labelPosition="left" :model="form" :rules="rules" ref="form" labelWidth='120px'
				:labelStyle='labelStyle'>
				<view class="title">
					基础信息
				</view>
				<view class="box">
					<u-form-item label="作业申请单位" prop="zysqdw" borderBottom>
						<u--input v-model="form.zysqdw" placeholder="选择作业申请单位" border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<u-form-item label="作业申请时间" prop="zysqsj" borderBottom>
						<u--input v-model="form.zysqsj" placeholder="选择作业申请时间" border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<u-form-item label="作业实施时间" prop="zysssj" borderBottom>
						<u--input v-model="form.zysssj" placeholder="选择作业实施时间" border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<u-form-item label="监护人" prop="jhr" borderBottom>
						<u--input v-model="form.jhr" placeholder="选择监护人" border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					
					
					<u-form-item label="维修内容" prop="wxnr" borderBottom>
						<u--textarea v-model="form.wxnr" placeholder="输入维修内容"></u--textarea>
					</u-form-item>
					<u-form-item label="维修地点" prop="wxdd" borderBottom>
						<u--input v-model="form.wxdd" placeholder="选择维修地点" border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<u-form-item label="待办人" prop="dbr" borderBottom>
						<u--input v-model="form.dbr" placeholder="选择待办人" border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<u-form-item label="检修负责人" prop="jxfzr" borderBottom>
						<u--input v-model="form.jxfzr" placeholder="选择检修负责人" border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<u-form-item label="检修期限" prop="jxqx" borderBottom>
						<u--input v-model="form.jxqx" placeholder="选择检修期限" border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					
					
				</view>
				<view class="title">
					关联特殊作业
				</view>
				<view class="box">
					<u-form-item label="关联特殊作业" prop="gltszy" >
						<u--input v-model="form.gltszy" placeholder="选择关联特殊作业" border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
				</view>
				
				<view class="title">
					危害辨识-安全措施
				</view>
				<view class="box">
					<u-form-item label="危害辨识" prop="whbs" borderBottom>
						<u--input v-model="form.whbs" placeholder="选择危害因素"  border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<u-form-item label="安全措施" prop="aqcs" borderBottom>
						<u--input v-model="form.aqcs" placeholder="选择安全措施"  border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<u-form-item label="个人用品防护" prop="grypfh" borderBottom>
						<u--input v-model="form.grypfh" placeholder="选择个人用品防护" border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					
				</view>
				<view class="title">
					安全交底
				</view>
				<view class="box">
					<u-form-item label="安全交底人" prop="aqjdr" borderBottom>
						<u--input v-model="form.aqjdr" placeholder="选择安全交底人"  border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<u-form-item label="接受交底人" prop="jsjdr" borderBottom>
						<u--input v-model="form.jsjdr" placeholder="选择接受交底人"  border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					
				</view>
				<view class="title">
					安全教育
				</view>
				<view class="box">
					<u-form-item label="实施安全教育人" prop="ssaqjyr" borderBottom>
						<u--input v-model="form.ssaqjyr" placeholder="选择实施安全教育人"  border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<u-form-item label="是否已实施" prop="sfyss" borderBottom>
						<u--input v-model="form.sfyss" placeholder="选择是否已实施"  border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					
				</view>
				<view class="title">
					审核人/审核部门
				</view>
				<view class="box">
					<u-form-item label="作业负责人意见" prop="zyfzryj" borderBottom>
						<u--input v-model="form.zyfzryj" placeholder="选择作业负责人"  border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<u-form-item label="所在单位" prop="zysqdw" borderBottom>
						<u--input v-model="form.zysqdw" placeholder="选择所在单位审批人"  border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
				</view>
				<view class="title">
					验收
				</view>
				<view class="box">
					<u-form-item label="验收" prop="ysr" borderBottom>
						<u--input v-model="form.ysr" placeholder="选择验收人"  border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					
				</view>
			</u--form>
			<u-button type="primary" text="申请" @click="submit" class='but'></u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				labelStyle: {
					color: '#666'
				},
				form: {
					zysqdw:'',
					zysqsj:'',
					zysssj:'',
					jhr:'',
					wxnr:'',
					wxdd:'',
					dbr:'',
					jxfzr:'',
					gltszy:'',
					jxqx:'',
					aqcs:'',
					whbs:'',
					grypfh:'',
					aqjdr:'',
					jsjdr:'',
					ssaqjyr:'',
					sfyss:'',
					zyfzryj:'',
					ysr:'',
					zyfzryj:'',
				},
				
				rules: {
					'zysqdw': {
						type: 'string',
						required: true,
						message: '请填写姓名',
						trigger: ['blur', 'change']
					},
					'userInfo.sex': {
						type: 'string',
						max: 1,
						required: true,
						message: '请选择男或女',
						trigger: ['blur', 'change']
					},
				},
				radio: '',
				switchVal: false
			};
		},
		methods: {
			submit() {
				console.log(this.form)
			}
		}
	}
</script>

<style lang="scss">
	.container {
		padding: 0 24rpx;
		background-color: #f6f6f6;

		.title {
			font-size: 28rpx;
			font-weight: 500;
			color: #999999;
			line-height: 44rpx;
			padding: 20rpx 48rpx;
		}

		.box {
			padding: 0rpx 48rpx;
			background-color: #fff;
			border-radius: 20rpx;
		}
	}
	.but{
		margin: 30rpx 0;
	}
</style>
